import tool from "@/common/tool.js";
class Blogdetail {
  mixin = {
    data() {
      return {
        tags: ["label", "asd"],
        comment: {
          comment: "",
          placeholder: "Enter your comments",
          list: [],
          total: 0 //评价总数
        },
        loading: true, //评论加载loading
        commentForm: {
          id: "",
          page: 1,
          page_size: 10
        },
      }
    },
    head() {
      return {
        title: this.blogInfo.title || 'missyeah',
        meta: [{
            hid: "keywords",
            name: "keywords",
            content: this.blogInfo.seo_keyword || 'missyeah',
          },
          {
            hid: "description",
            name: "description",
            content: this.blogInfo.seo_keyword || 'missyeah',
          },
        ],
        link: [{
          rel: "canonical",
          href: this.canonical || 'https://www.missyeah.com',
        }],
      }
    },
    async asyncData(that) {
      let canonical = "https://www.missyeah.com" + that.route.fullPath;
      let id = that.route.params.blogdetail;
      let res = await that.store.dispatch("blog/blogInfo", {
        id: id
      });
      res.data.info.content = tool.clearEditInfo(res.data.info.content);
      return {
        blogInfo: res.data.info,
        canonical
      }
    },
    mounted() {
      this.commentForm.id = this.$route.params.blogdetail;
      this.getBlogCommentList();
      if (this.isLogin) {
        this.comment.placeholder = "Enter your comments"
      } else {
        this.comment.placeholder = "You need to log in before you can comment";
      }
      this.isThumdsBlog();
      console.log(this.blogInfo);
    },
    methods: {
      //点赞文章
      async thumdsArtice() {
        if (this.checkLogin()) {
          this.tips.startLoadingToast();
          let res = await this.$store.dispatch("blog/thumbsUp", {
            id: this.commentForm.id,
          });
          this.tips.closeToast();
          if (res.code == 0) {
            if (this.blogInfo.thumbs_up) {
              this.blogInfo.thumbs_up = false;
              this.blogInfo.like--;
            } else {
              this.blogInfo.thumbs_up = true;
              this.blogInfo.like++;
            }

          }
        }
      },
      //获取是否点赞过文章
      async isThumdsBlog() {
        if (this.isLogin) {
          let res = await this.$store.dispatch("blog/isthumbsUp", {
            id: this.commentForm.id,
          });
          if (res.code == 0) {
            this.blogInfo.thumbs_up = res.data.isThumbsUp
          }
        }
      },
      //发表评论
      async submitComment() {
        if (this.checkLogin()) {
          if (this.comment.comment == "") {
            this.$toast("Please enter comments")
          } else {
            this.tips.startLoadingToast();
            let res = await this.$store.dispatch("blog/comment", {
              article_id: this.commentForm.id,
              content: this.comment.comment,
              stars: 5
            });
            this.tips.closeToast();
            this.comment.comment = "";
            if (res.code == 0) {
              this.$toast("The comment is successful and appears after the review is passed");
              //this.getBlogCommentList();
            }
          }
        }
      },
      //获取博客评价列表
      async getBlogCommentList() {
        this.loading = true;
        let res = await this.$store.dispatch("blog/commentList", this.commentForm);
        //console.log(res);
        this.loading = false;
        if (res.code == 0 && res.data != undefined) {
          this.comment.list = res.data.list;
          this.comment.total = res.data.paginatio.total;
        }
      },
      //检查是否登陆
      checkLogin() {
        if (!this.isLogin) {
          this.$router.push({
            path: "/login",
            query: {
              redirect: "/blog/" + this.commentForm.id,
            },
          });
        } else {
          return true;
        }
      },
      //换页
      pageChange(index) {
        this.commentForm.page = index;
        this.getBlogCommentList();
      }
    },
  }
}
export default new Blogdetail();
